<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="org.apache.shiro.web.filter.authc.FormAuthenticationFilter"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <meta charset="utf-8">
    <!-- BootStrap不支持IE的兼容模式,下面代码为了代码在IE下运行最新的渲染模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 初始化移动设备的浏览 width=device-width 视口的宽度等于设备宽度，initial-scale=1 缩放比例为1 -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>极简::空白页::基础</title>

    <!-- 加载Bootstrap css 样式 -->
    <link href="${ctx}/static/bootstrap-3.2.0-dist/css/bootstrap.min.css" rel="stylesheet">
    
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- 使IE8支持HTML5标签 -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="${ctx}/static/support/html5shiv.min.js"></script>
      <script src="${ctx}/static/respond.min.js"></script>
    <![endif]-->
    
  </head>
  <body>
    <div class="container">
      <!-- 设置登录框与网页顶部的间隔 -->
      <div style="margin-top: 40px;"></div>
      <!-- 判断是否登录成功，如果不成功，给出警告 -->
      <%
      String error = (String) request.getAttribute(FormAuthenticationFilter.DEFAULT_ERROR_KEY_ATTRIBUTE_NAME);
      if(error != null){
      %>
      <div class="alert alert-warning alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert">
          <span aria-hidden="true">&times;</span>
          <span class="sr-only">关闭</span>
        </button>
        <strong>⚠警告:</strong> 登录失败,帐号或密码错误
      </div>
      <%
      }
      %>
      
      <div class="panel panel-info">
        <!-- 面板头部 -->
        <div class="panel-heading">
          <h3 class="panel-title">用户登录</h3>
        </div>
        <!-- /面板头部 -->
        
        <div class="panel-body">
        <!-- 面板主体内容 -->
          <form action="${ctx}/login" method="post" role="form">
            <div class="form-group">
              <label for="username">用户名 / 邮箱 / 手机号</label>
              <input type="text" class="form-control" id="username" name="username" value="${username}" placeholder="输入登录账号">
            </div>
            <div>
              <label for="password">密码</label>
              <input type="password" class="form-control" id="password" name="password" placeholder="密码" >
            </div>
            <br>
            <button type="submit" class="btn btn-default"> 登 录 </button>
          </form>
        <!-- ／面板主体内容 -->  
        </div>
      </div>
    </div>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="${ctx}/static/jquery/jquery-1.11.1.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="${ctx}/static/bootstrap-3.2.0-dist/js/bootstrap.min.js"></script>
  </body>
</html>